<template>
  <tr>
    <td>
      <input
        type="checkbox"
        name=""
        id=""
        :checked="checked"
        @change="$emit('handleChange', index)"
      />
    </td>
    <td>{{ name }}</td>
    <td>{{ price }}</td>
    <td>
      <button @click="cut">-</button> {{ num }} <button @click="add">+</button>
    </td>
    <td>{{ price * num }}</td>
    <td><button @click="del">删除</button></td>
  </tr>
</template>

<script>
export default {
  //   name: "",
  components: {},
  props: {
    name: {
      type: String,
      require: true,
    },
    price: {
      type: Number,
      require: true,
    },
    num: {
      type: Number,
      require: true,
    },
    checked: {
      type: Boolean,
      require: true,
    },
    index: {
      type: Number,
      require: true,
    },
  },
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    cut() {
      this.num ? this.$emit("handleCut", this.num - 1) : 0;
    },
    add() {
      this.$emit("handleAdd", this.num + 1);
    },
    del(index) {
      this.$emit("handleDel", index);
    },
  },
};
</script>

<style lang="less" scoped></style>
